<template>
      <a-modal v-model="show" :title="isEdit ? '修改数据源' : '新增数据源'" :maskClosable="false" @cancel="canceladdMould()">
        <a-form-model :label-col="{ span: 6 }" :wrapper-col="{ span: 14 }" :model="listInfo" :rules="listInforules"
          ref="ruleForm">
          <a-form-model-item label="数据源名称" required prop="DataSourceName">
            <a-input v-model="listInfo.DataSourceName" />
          </a-form-model-item>
          <a-form-model-item label="数据源描述">
            <a-textarea style="resize: none" v-model="listInfo.DataSourceDesc" />
          </a-form-model-item>

        </a-form-model>
        <template slot="footer">
          <a-button key="back" @click="canceladdMould">取消</a-button>
          <a-button key="submit" type="primary"  @click="addhandleOk">提交</a-button>
        </template>
      </a-modal>
  </template>
  
  <script>
import { addDataSource, updateDataSource } from '@/api/DataSource'
  export default {
    props: ["show", "isEdit", "listInfo"],
    data() {
      return {
        
        listInforules: {
          DataSourceName: [
            { required: true, message: "填写数据源名称", trigger: "blur" },
          ],
        }, //添加数据源校验
        
      };
    },
    methods: {
      //添加模板窗口关闭方法
      canceladdMould() {
        this.$emit("update:show", false);
        this.$refs.ruleForm.clearValidate();
      },
      //添加模板的提交方法
      addhandleOk() {
        this.$refs.ruleForm.validate(async (valid) => {
          if (valid) {
            /* false为添加 */
            if (!this.isEdit) {
              let res = await addDataSource(this.listInfo)
              this.$message.success('添加成功');
              this.$emit('renewList')
              this.canceladdMould();
  
            } else {
              let res = await updateDataSource(this.listInfo)
              this.$message.success('修改成功');
              this.$emit('renewList')
              this.canceladdMould();
            }
          } else {
            this.$message.error("请填写完必填信息");
          }
        });
      },
    },
  };
  </script>
  
  <style lang="less" scoped></style>
  